<template>
  <div id="dialogIntegralActionEdit">
    <el-dialog
      :title="isAdd ? '新增' : '编辑'"
      :visible.sync="dialogData.isShow"
      width="850px"
      top="50px"
      :before-close="labelHandleClose"
    >
      <div class="form-box">
        <el-form
          ref="ruleForm"
          :model="ruleForm"
          :rules="rules"
          label-width="90px"
        >
          <h1 class="form-title">优惠券发放规则设置：</h1>
          <el-form-item label="发放类型" prop="grantType">
            <el-radio-group v-model="ruleForm.grantType" :disabled="!isAdd">
              <el-radio
                v-for="item in typeList"
                :key="item.dictValue"
                :label="item.dictValue"
              >
                {{ item.dictLabel }}
              </el-radio>
            </el-radio-group>
          </el-form-item>
          <!--关联项目-->
          <div v-if="ruleForm.grantType === 'PUBLIC'">
            <el-form-item label="关联项目" prop="projectNameIds">
              <ul
                style="display:inline-block"
                v-for="item in ruleForm.projectNameIds"
                :key="item.id"
              >
                {{
                  item.name + ','
                }}
              </ul>
              <el-button
                type="primary"
                @click="showAssociatedItems"
                :disabled="!isAdd && ruleForm.grantType === 'PUBLIC'"
                icon="el-icon-circle-plus-outline"
                >您选择项目</el-button
              >
            </el-form-item>
          </div>

          <el-form-item label="优惠券名称" prop="couponName">
            <el-input
              v-model="ruleForm.couponName"
              placeholder="请输入优惠券名称"
              maxlength="10"
              show-word-limit
              :disabled="!isAdd"
            ></el-input>
          </el-form-item>
          <el-form-item label="优惠券类型" prop="couponType">
            <el-select
              v-model="ruleForm.couponType"
              placeholder="请选择优惠券类型"
              :disabled="!isAdd"
            >
              <el-option
                v-for="item in couponTypeList"
                :key="item.dictLabel"
                :label="item.dictLabel"
                :value="item.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
          <!--固定金额券-->
          <div v-if="ruleForm.couponType === 'FIXED'">
            <el-form-item
              label="优惠金额"
              prop="fixedAmount"
              class="full-input"
            >
              <el-input-number
                v-model.number="ruleForm.fixedAmount"
                size="mini"
                :min="0"
                :max="9999"
                :controls="false"
                :step="1"
                step-strictly
                placeholder="请输入优惠券面额"
                :disabled="!isAdd"
              ></el-input-number>
            </el-form-item>
          </div>
          <!--满减-->
          <div v-if="ruleForm.couponType === 'FULL_REDUCTION'">
            <el-form-item
              class="small"
              label="优惠金额"
              prop="achieve"
              :disabled="!isAdd"
            >
              订单满
              <el-input-number
                v-model.number="ruleForm.achieve"
                size="mini"
                :min="0"
                :max="9999"
                :controls="false"
                :step="1"
                step-strictly
                :disabled="!isAdd"
              ></el-input-number>
              元，减
              <el-form-item label="" prop="reduction" class="line reduction">
                <el-input-number
                  v-model.number="ruleForm.reduction"
                  size="mini"
                  :min="0"
                  :max="9999"
                  :controls="false"
                  :step="1"
                  step-strictly
                  :disabled="!isAdd"
                ></el-input-number>
                元
              </el-form-item>
            </el-form-item>
          </div>
          <!--折扣-->
          <div v-if="ruleForm.couponType === 'DISCOUNT'">
            <el-form-item class="small" label="优惠金额" prop="percentage">
              订单金额
              <el-input-number
                v-model.number="ruleForm.percentage"
                size="mini"
                :min="10"
                :max="100"
                :controls="false"
                :step="1"
                step-strictly
                :disabled="!isAdd"
              ></el-input-number>
              %
              <el-input-number
                v-model.number="ruleForm.discount"
                size="mini"
                :min="1"
                :max="10"
                :controls="false"
                disabled
              ></el-input-number>
              折
            </el-form-item>
          </div>
          <!--系统发放，展示发放场景-->
          <div v-if="ruleForm.grantType === 'SYSTEM'">
            <el-form-item label="发放场景" prop="scene">
              <el-checkbox-group v-model="ruleForm.scene" :disabled="!isAdd">
                <el-checkbox
                  v-for="item in sceneList"
                  :key="item.dictValue"
                  :label="item.dictValue"
                >
                  {{ item.dictLabel }}
                </el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <!--人工发放，展示发放方式、发放对象-->
          <div v-if="ruleForm.grantType === 'ARTIFICIAL'">
            <el-form-item label="发放方式" prop="giveMethod">
              <el-select
                v-model="ruleForm.giveMethod"
                placeholder="请选择发放方式"
              >
                <el-option
                  v-for="item in giveMethodList"
                  :key="item.dictLabel"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </div>
          <!-- 导入发放对象 大鹏号或手机号 -->
          <div
            v-if="
              ruleForm.grantType === 'ARTIFICIAL' &&
                ruleForm.giveMethod === 'import'
            "
          >
            <el-form-item prop="importObjectType">
              <el-radio-group v-model="ruleForm.importObjectType">
                <el-radio
                  v-for="item in giveImprotObjList"
                  :key="item.dictValue"
                  :label="item.dictValue"
                >
                  {{ item.dictLabel }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </div>
          <!-- 导入发放对象 大鹏号 -->
          <div
            v-if="
              ruleForm.grantType === 'ARTIFICIAL' &&
                ruleForm.giveMethod === 'import' &&
                ruleForm.importObjectType === 'DAPENGHAO'
            "
          >
            <el-form-item label="" prop="dpAccounts">
              <!--Excel导入-->
              <importAutoFile
                :dialogData="fileData"
                :importObjectType="ruleForm.importObjectType"
                :showTotal="false"
                @getUsers="getUsers"
                @showError="showError"
              ></importAutoFile>
            </el-form-item>
          </div>
          <!-- 导入发放对象 手机号 -->
          <div
            v-if="
              ruleForm.grantType === 'ARTIFICIAL' &&
                ruleForm.giveMethod === 'import' &&
                ruleForm.importObjectType === 'IPHONE'
            "
          >
            <el-form-item label="" prop="mobiles">
              <!--Excel导入-->
              <importAutoFile
                :dialogData="fileIphonesData"
                :showTotal="false"
                :importObjectType="ruleForm.importObjectType"
                @getIphones="getIphones"
                @mobileError="mobileError"
              ></importAutoFile>
            </el-form-item>
          </div>

          <div
            v-if="
              ruleForm.grantType === 'ARTIFICIAL' &&
                ruleForm.giveMethod === 'appoint'
            "
          >
            <el-form-item label="发放对象" prop="issueObjectType">
              <el-radio-group v-model="ruleForm.issueObjectType">
                <el-radio
                  v-for="item in giveObjList"
                  :key="item.dictValue"
                  :label="item.dictValue"
                >
                  {{ item.dictLabel }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </div>

          <!--人工发放 & 指定发放 & 单个发放-->

          <!-- 指定单个发放对象 大鹏号或手机号 -->
          <div
            v-if="
              ruleForm.grantType === 'ARTIFICIAL' &&
                ruleForm.issueObjectType === 'DEFAULT' &&
                ruleForm.giveMethod === 'appoint'
            "
          >
            <el-form-item prop="issueObjectType">
              <el-radio-group v-model="ruleForm.importObjectType">
                <el-radio
                  v-for="item in giveImprotObjList"
                  :key="item.dictValue"
                  :label="item.dictValue"
                >
                  {{ item.dictLabel }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </div>
          <!-- 指定单个发放对象 大鹏号 -->
          <div
            v-if="
              ruleForm.grantType === 'ARTIFICIAL' &&
                ruleForm.giveMethod === 'appoint' &&
                ruleForm.issueObjectType === 'DEFAULT' &&
                ruleForm.importObjectType === 'DAPENGHAO'
            "
          >
            <el-form-item label="" prop="dpAccounts">
              <selectDpNumber :file-data="dpNumberfileData">
                <template v-slot:tips
                  ><span class="tips"
                    >最多输入5个用户信息，超出5个需要导入用户</span
                  ></template
                >
              </selectDpNumber>
            </el-form-item>
          </div>
          <!-- 指定单个发放对象 手机号 -->
          <div
            v-if="
              ruleForm.grantType === 'ARTIFICIAL' &&
                ruleForm.giveMethod === 'appoint' &&
                ruleForm.issueObjectType === 'DEFAULT' &&
                ruleForm.importObjectType === 'IPHONE'
            "
          >
            <el-form-item label="" prop="mobiles">
              <selectIpNumber :file-data="ipNumberfileData">
                <template v-slot:tips
                  ><span class="tips"
                    >最多输入5个用户信息，超出5个需要导入用户</span
                  ></template
                >
              </selectIpNumber>
            </el-form-item>
          </div>
          <!--人工发放 & 指定发放 & 指定学院属性用户-->
          <div
            v-if="
              ruleForm.grantType === 'ARTIFICIAL' &&
                ruleForm.giveMethod === 'appoint' &&
                ruleForm.issueObjectType === 'COLLEGE_USER'
            "
          >
            <el-form-item label="" prop="issueCollegeIds">
              <el-select
                v-model="ruleForm.issueCollegeIds"
                multiple
                placeholder="选择学院"
                clearable
              >
                <el-option
                  v-for="item in collegeList"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </div>
          <h1 class="form-title">优惠券适用规则设置：</h1>
          <div v-if="ruleForm.grantType === 'PUBLIC'">
            <el-form-item
              label="优惠券有效期"
              prop="publicTime"
              label-width="126px"
            >
              <el-date-picker
                v-model="ruleForm.publicTime"
                type="datetimerange"
                size="mini"
                range-separator="至"
                start-placeholder="开始日期时间"
                end-placeholder="结束日期时间"
                value-format="yyyy-MM-dd HH:mm:ss"
                :disabled="!isAdd"
              >
              </el-date-picker>
            </el-form-item>
          </div>
          <div
            v-if="
              ruleForm.grantType === 'SYSTEM' ||
                ruleForm.grantType === 'ACTIVITY' ||
                ruleForm.grantType === 'GOODS'
            "
          >
            <el-form-item
              label="优惠券有效期"
              prop="validity"
              label-width="126px"
            >
              <el-radio-group v-model="ruleForm.validity" :disabled="!isAdd">
                <el-radio
                  v-for="item in timeList"
                  :key="item.dictValue"
                  :label="item.dictValue"
                >
                  {{ item.dictLabel }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </div>

          <div v-if="ruleForm.grantType === 'ARTIFICIAL'">
            <el-form-item
              label="优惠券限领数量"
              prop="limitNumber"
              label-width="126px"
              class="full-input"
            >
              <el-input-number
                v-model.number="ruleForm.limitNumber"
                :min="1"
                :max="9999"
                :controls="false"
                :step="1"
                step-strictly
                placeholder="只能输入正整数，输入0则代表不限数量"
                :disabled="!isAdd"
              ></el-input-number>
            </el-form-item>
          </div>

          <el-form-item
            label="优惠券适用范围"
            prop="usingRange"
            label-width="126px"
          >
            <el-radio-group
              v-model="ruleForm.usingRange"
              :disabled="
                (!isAdd && ruleForm.grantType === 'ARTIFICIAL') ||
                  (!isAdd && ruleForm.grantType === 'PUBLIC')||
                    (!isAdd && ruleForm.grantType === 'GOODS')
              "
            >
              <el-radio
                v-for="item in rangeList"
                :key="item.dictValue"
                :label="item.dictValue"
              >
                {{ item.dictLabel }}
              </el-radio>
            </el-radio-group>
          </el-form-item>
          <!--指定学院属性-->
          <div v-if="ruleForm.usingRange === 'COLLEGE'">
            <el-form-item label="" prop="collegeIds">
              <el-select
                v-model="ruleForm.collegeIds"
                multiple
                placeholder="选择学院"
                clearable
                :disabled="
                  (!isAdd && ruleForm.grantType === 'ARTIFICIAL') ||
                    (!isAdd && ruleForm.grantType === 'PUBLIC')||
                      (!isAdd && ruleForm.grantType === 'GOODS')
                "
              >
                <el-option
                  v-for="item in collegeList"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </div>

          <!--指定商品课程-->
          <div v-if="ruleForm.usingRange === 'COURSE'">
            <el-form-item label="" prop="courseIds">
              <el-button
                type="primary"
                @click="showClassDialog"
                :disabled="
                  (!isAdd && ruleForm.grantType === 'ARTIFICIAL') ||
                    (!isAdd && ruleForm.grantType === 'PUBLIC')||
                     (!isAdd && ruleForm.grantType === 'GOODS')
                "
                >选择课程</el-button
              >
              已选择课程:
              {{ ruleForm.courseIds ? ruleForm.courseIds.length : 0 }}
              <!-- 显示指定课程名字 -->
              <ul
                style="display:inline-block"
                v-for="(item, index) in ruleForm.courseNames"
                :key="index"
              >
                {{
                  item + ','
                }}
              </ul>
            </el-form-item>
          </div>
          <!-- 公用发放 使用场景-->
          <div v-if="ruleForm.grantType === 'PUBLIC'">
            <el-form-item
              label="使用场景"
              prop="usageScenario"
              label-width="126px"
            >
              <el-radio-group
                v-model="usageScenario"
                @change="handleUsageScenario"
              >
                <el-radio
                  v-for="item in singleAll"
                  :key="item.dictValue"
                  :label="item.dictValue"
                >
                  {{ item.dictLabel }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
            <div
              v-if="
                ruleForm.grantType === 'PUBLIC' && this.usageScenario != 'ALL'
              "
            >
              <el-form-item prop="useScene" label-width="126px">
                <el-checkbox-group
                  v-model="ruleForm.useScene"
                  @change="handleCheckedClassChange"
                >
                  <el-checkbox
                    v-for="item in sinceList"
                    :label="item.dictValue"
                    :key="item.dictValue"
                    >{{ item.dictLabel }}</el-checkbox
                  >
                </el-checkbox-group>
              </el-form-item>
            </div>
          </div>

          <!-- 订单是否支持升级 -->
          <div v-if="ruleForm.grantType === 'SYSTEM'">
            <el-form-item
              label="订单升级是否可用"
              prop="orderUpgrade"
              label-width="126px"
            >
              <el-radio-group v-model="ruleForm.orderUpgrade">
                <el-radio
                  v-for="item in upgradeList"
                  :key="item.dictValue"
                  :label="item.dictValue"
                  :disabled="!isAdd"
                >
                  {{ item.dictLabel }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </div>
          <div v-if="ruleForm.grantType === 'ARTIFICIAL'">
            <el-form-item label="优惠券有效期" prop="time" label-width="126px">
              <el-date-picker
                v-model="ruleForm.time"
                type="datetimerange"
                size="mini"
                range-separator="至"
                start-placeholder="开始日期时间"
                end-placeholder="结束日期时间"
                value-format="yyyy-MM-dd HH:mm:ss"
                :disabled="!isAdd"
              >
              </el-date-picker>
            </el-form-item>
          </div>
        </el-form>
      </div>
      <!-- 表单部分 -->
      <span slot="footer" class="dialog-footer">
        <el-button type="success" plain @click="cancelLabel">取 消</el-button>
        <el-button
          type="success"
          :loading="loading"
          @click="confirmLabel('ruleForm')"
          >确认</el-button
        >
      </span>
    </el-dialog>
    <dialogChooseClass
      v-if="classDialogData.isShow"
      :dialog-data="classDialogData"
      @setChooseClass="setChooseClass"
    ></dialogChooseClass>
    <!-- 关联项目标签弹窗 -->
    <associatedItems
      v-if="associatedItemsData.isShow"
      :dialog-data="associatedItemsData"
      @setAssociatedItems="setAssociatedItems"
    ></associatedItems>
    <!-- 导入失败弹窗 -->
    <errorDialog
      v-if="errorDialogData.isShow"
      :dialog-data="errorDialogData"
      from="userRule"
    ></errorDialog>
    <errorDialog
      v-if="errorDialogData.isShow"
      :dialog-data="errorDialogData"
      from="mobile"
    ></errorDialog>
  </div>
</template>
<script>
import { sysNormalDisable } from '@utils/dictionariesFunc'
import {
  importUrl,
  downloadUrl,
  importMobileUrl,
  downloadMobileUrl
} from '@/api/system/user' // 大鹏号和手机号导入与下载接口
import {
  addtCoupons,
  eidtCoupons,
  getCouponsDetail,
  getCollegeList
} from '@/api/couponsIntegral/coupons' // 接口
import importAutoFile from '@common/importFileAuto' // 导入
import errorDialog from '@common/errorDialog' // 导入失败弹窗
import selectDpNumber from '@component/common/selectDpNumber' // 可输入搜索下拉框-查询大鹏号
import selectIpNumber from '@component/common/selectIpNumber' // 可输入搜索下拉框-查询手机号
import associatedItems from '@component/intergralManagement/couponManagement/com/associatedItems'
import dialogChooseClass from '@component/intergralManagement/couponManagement/com/dialogChooseClass' // 选择课程
import { contentToStr } from '../../../utils/pubFunction'
export default {
  msg: '优惠券管理-编辑弹窗',
  props: ['dialogData'],
  components: {
    importAutoFile,
    selectDpNumber,
    selectIpNumber,
    dialogChooseClass,
    associatedItems,
    errorDialog
  },
  data() {
    var valiAchieve = (rule, value, callback) => {
      if (!value && value !== 0) {
        callback(new Error('订单满额不能为空'))
      } else {
        let reduction = this.ruleForm.reduction
        if (reduction && reduction > value) {
          callback(new Error('订单满额须大于等于减少金额'))
        } else {
          callback()
        }
      }
    }
    var valiReduction = (rule, value, callback) => {
      if (!value && value !== 0) {
        callback(new Error('减少金额不能为空'))
      } else {
        let achieve = this.ruleForm.achieve
        if (achieve && achieve < value) {
          callback(new Error('减少金额须小于等于订单满额'))
        } else {
          callback()
        }
      }
    }
    return {
      loading: false,
      isAdd: true, //默认新增
      checkData: [], //选中课程
      CheckLabel: [], //选中项目标签
      fileData: {
        url: '', // 导入接口
        downUrl: '', // 下载模板接口
        users: [] // 上传成功后，返回的users
      },
      fileIphonesData: {
        url: '', // 导入接口
        downUrl: '', // 下载模板接口
        iphones: [] // 上传成功后，返回的users
      },
      // 导入失败弹框的数据
      errorDialogData: {
        isShow: false, // 控制弹框显示
        warningText: '' // 参数
      },
      typeList: [], // 优惠券发放类型: [系统: SYSTEM | 人工:ARTIFICIAL]
      couponTypeList: [], // 优惠券类型: [固定金额:FIXED | 满减:FULL_REDUCTION | 折扣:DISCOUNT] 字典: [coupon_types]
      sceneList: [], // 发放场景(可多选): [注册:REGISTER| 续费:RENEW | 领取礼包:PACKAGE | 购买课程:BUY_COURSE]
      timeList: [], // 优惠券有效期
      rangeList: [], // 优惠券使用范围: [全部:ALL | 学院: COLLEGE | 商品课程:COURSE]
      upgradeList: [
        { dictValue: 'true', dictLabel: '支持' },
        { dictValue: 'false', dictLabel: '不支持' }
      ], // 订单升级是否可用
      giveMethodList: [
        { dictValue: 'import', dictLabel: '导入发放' },
        { dictValue: 'appoint', dictLabel: '指定发放' }
      ], // 发放方式
      giveObjList: [], // 发放对象 [ 默认(指定大鹏号):DEFAULT | 所有用户:ALL_USER | 新用户:NEW_USER | 领取礼包用户:PACKAGE_USER | 学院用户:COLLEGE_USER]
      giveImprotObjList: [], //导入发对象 单个输入对象  大鹏号：DAPENG 手机号:IPHONE
      collegeList: [], // 学院
      // 传递给导入弹框的数据
      importDialogData: {
        downUrl: '' // 下载模板接口
      },
      dpNumberfileData: {
        labelName: '', // label名称
        dpNum: [], // 大鹏号
        limit: 5 // 限制个数
      }, //人工发放-指定发放-单个发放，选择大鹏号
      ipNumberfileData: {
        labelName: '', // label名称
        ipNum: [], // 手机号
        limit: 5 // 限制个数
      }, //人工发放-指定发放-单个发放，选择手机号
      // 传递给编辑弹框的数据
      classDialogData: {
        isShow: false, // 控制弹框显示
        params: {} // 参数
      },
      // 传递给关联项目弹窗数据
      associatedItemsData: {
        isShow: false, //控制弹窗显示
        params: {} //参数
      },
      //展示关联直播间id
      roomIdList: [
        {
          value: '',
          id: ''
        }
      ],
      isSpan: false, //控制直播间号是否为空显示提示
      usageScenario: '', //使用场景 single是指定场景 all是全部
      singleAll: [], // 指定场景  全部
      showCheckData: [],
      sinceList: [{ dictLabel: '', dictValue: '' }], //营课或回放
      sinceALL: [], //场景全选
      ruleForm: {
        grantType: '', //发放类型
        couponName: '', // 优惠券名称
        couponType: '', //优惠券类型
        associatedItems: '', //关联项目
        fixedAmount: undefined, //优惠券金额
        achieve: undefined, //满
        reduction: undefined, //减
        percentage: undefined, //百分比
        discount: undefined, //折
        scene: [], // 发放场景
        time: '', //优惠券有效期（人工发放）
        publicTime: '', //优惠券有效期（公共发放）
        usingRange: '', //优惠券适用范围
        collegeIds: [], //指定学院(优惠券范围)
        courseIds: [], //商品课程(优惠券范围)
        courseNames: [], //人工修改指定课程名称
        projectNameIds: [], //项目标签
        orderUpgrade: 'true', //订单升级是否可用
        giveMethod: 'import', //发放方式
        issueObjectType: '', //发放对象
        importObjectType: '', //导入发放对象
        // appointObjectType: '', //单个指定发放对象
        issueCollegeIds: [], //发放对象指定学院属性用户
        limitNumber: undefined, //优惠券限领数量
        validity: '', //优惠券有效期(系统发放)
        startTime: '', //开始时间
        endTime: '', //结束时间
        dpAccounts: [], //批量导入，导入的大鹏号数组
        mobiles: [], //批量导入，导入手机号数组
        useScene: [] //选中营课直播或者营课回放
      },
      rules: {
        grantType: {
          required: true,
          message: '发放类型不能为空',
          trigger: 'blur'
        },
        couponName: {
          required: true,
          message: '优惠券名称不能为空',
          trigger: 'blur'
        },
        couponType: {
          required: true,
          message: '优惠券类型不能为空',
          trigger: 'blur'
        },
        fixedAmount: {
          required: true,
          message: '优惠券金额不能为空',
          trigger: 'blur'
        },
        achieve: {
          validator: valiAchieve,
          trigger: 'blur'
        },
        reduction: {
          validator: valiReduction,
          trigger: 'blur'
        },
        /*achieve: {
          required: true,
          message: '订单满额不能为空',
          trigger: 'blur'
        },
        reduction: {
          required: true,
          message: '减少金额不能为空',
          trigger: 'blur'
        },*/
        discount: {
          required: true,
          message: '金额不能为空',
          trigger: 'blur'
        },
        percentage: {
          required: true,
          message: '折扣不能为空',
          trigger: 'blur'
        },
        createTime: {
          required: true,
          message: '时间区间不能为空',
          trigger: 'blur'
        },
        scene: {
          type: 'array',
          required: true,
          message: '发放场景不能为空',
          trigger: 'change'
        },
        validity: {
          required: true,
          message: '优惠券有效期不能为空',
          trigger: 'blur'
        },
        time: {
          type: 'array',
          required: true,
          message: '优惠券有效期不能为空',
          trigger: 'blur'
        },
        publicTime: {
          type: 'array',
          required: true,
          message: '优惠券有效期不能为空',
          trigger: 'blur'
        },
        // range: {
        //   required: true,
        //   message: '优惠券适用范围不能为空',
        //   trigger: 'blur'
        // },
        upgrade: {
          required: true,
          message: '订单升级是否可用不能为空',
          trigger: 'blur'
        },
        giveMethod: {
          required: true,
          message: '发放方式不能为空',
          trigger: 'blur'
        },
        issueObjectType: {
          required: true,
          message: '发放对象不能为空',
          trigger: 'blur'
        },
        importObjectType: {
          required: true,
          message: '发放对象不能为空',
          trigger: 'blur'
        },
        collegeIds: {
          type: 'array',
          required: true,
          message: '指定学院不能为空',
          trigger: 'change'
        },
        issueCollegeIds: {
          type: 'array',
          required: true,
          message: '指定学院不能为空',
          trigger: 'change'
        },
        limitNumber: {
          required: true,
          message: '优惠券限领数量不能为空',
          trigger: 'blur'
        },
        validity: {
          required: true,
          message: '优惠券有效期不能为空',
          trigger: 'blur'
        },
        courseIds: {
          type: 'array',
          required: true,
          message: '选择课程不能为空',
          trigger: 'change'
        },
        dpAccounts: {
          type: 'array',
          required: true,
          message: '导入大鹏号不能为空',
          trigger: 'blur'
        }
        // mobiles: {
        //   type: 'array',
        //   required: true,
        //   message: '导入手机号不能为空',
        //   trigger: 'blur'
        // }
      }
    }
  },
  watch: {
    'ruleForm.percentage': {
      handler(newV, oldV) {
        if (newV) {
          this.ruleForm.discount = newV / 10
        }
      },
      deep: true
    },
    'ruleForm.time': {
      //人工发放优惠券有效期
      handler(newVal, oldVal) {
        if (newVal && newVal.length > 1) {
          this.ruleForm.startTime = newVal[0]
          this.ruleForm.endTime = newVal[1]
        } else {
          this.ruleForm.startTime = ''
          this.ruleForm.endTime = ''
        }
      },
      deep: true
    },
    'ruleForm.publicTime': {
      //公共发放优惠券有效期
      handler(newVal, oldVal) {
        if (newVal && newVal.length > 1) {
          this.ruleForm.startTime = newVal[0]
          this.ruleForm.endTime = newVal[1]
        } else {
          this.ruleForm.startTime = ''
          this.ruleForm.endTime = ''
        }
      },
      deep: true
    },
    'ruleForm.giveMethod': {
      //监听导入方式
      handler(newV, oldV) {
        //导入方式切换，清空之前的数据
        this.ruleForm.dpAccounts = []
        this.ruleForm.mobiles = []
        if (newV === 'import') {
          this.ruleForm.issueObjectType = 'DEFAULT'
          // 默认导入方式
          this.ruleForm.importObjectType = 'DAPENGHAO'
        }
        if (newV === 'appoint') {
          // 默认发放对象
          this.ruleForm.importObjectType = 'DAPENGHAO'
        }
      },
      deep: 'true'
    },
    'ruleForm.issueObjectType': {
      //监听发放对象
      handler(newV, oldV) {
        //切换发放对象，清空之前的数据
        if (this.ruleForm.giveMethod === 'appoint') {
          if (newV !== 'DEFAULT') {
            this.dpNumberfileData.dpNum = []
          }
          if (newV !== 'COLLEGE_USER') {
            this.ruleForm.issueCollegeIds = []
          }
        }
      },
      deep: 'true'
    },
    'ruleForm.importObjectType': {
      //监听发放对象
      handler(newV, oldV) {
        //切换发放对象，清空之前的数据
        if (this.ruleForm.giveMethod === 'import') {
          if (newV !== 'DAPENGHAO') {
            this.dpNumberfileData.dpNum = []
          }
          if (newV !== 'IPHONE') {
            this.ipNumberfileData.ipNum = []
          }
        }
      },
      deep: 'true'
    },
    'ruleForm.importObjectType': {
      //监听发放对象
      handler(newV, oldV) {
        //切换发放对象，清空之前的数据
        if (this.ruleForm.giveMethod === 'appoint') {
          if (newV !== 'DAPENGHAO') {
            this.dpNumberfileData.dpNum = []
          }
          if (newV !== 'IPHONE') {
            this.ipNumberfileData.ipNum = []
          }
        }
      },
      deep: 'true'
    },
    'ruleForm.couponType': {
      //监听优惠券类型
      handler(newV, oldV) {
        if (newV !== 'FIXED') {
          //不是固定金额
          this.ruleForm.fixedAmount = undefined
        }
        if (newV !== 'FULL_REDUCTION') {
          //不是满减
          this.ruleForm.achieve = undefined
          this.ruleForm.reduction = undefined
        }
        if (newV !== 'DISCOUNT') {
          //不是折扣
          this.ruleForm.percentage = undefined
          this.ruleForm.discount = undefined
        }
      },
      deep: 'true'
    },
    'ruleForm.usingRange': {
      //监听优惠券适用范围
      handler(newV, oldV) {
        if (newV === 'ALL') {
          //全部
          this.ruleForm.collegeIds = []
          this.ruleForm.courseIds = []
        }
        if (newV === 'COLLEGE') {
          //学院
          this.ruleForm.courseIds = []
        }
        if (newV === 'COURSE') {
          //商品课程
          this.ruleForm.collegeIds = []
        }
      },
      deep: 'true'
    },
    'ruleForm.useScene': {
      //监听优惠券适用范围
      handler(newV, oldV) {
        if (newV === 'ALL') {
          //如果是全部就是全部
          this.usageScenario = 'ALL'
        }
        if (newV === 'YK_LIVE' || newV === 'YK_RECORD') {
          //如果是营课直播或者营课回放就是指定场景
          this.usageScenario = 'SINGLE'
        }
      },
      deep: 'true'
    },
    'ruleForm.grantType': {
      //监听发放类型
      handler(newV, oldV) {
        if (newV === 'SYSTEM') {
          //系统发放清空使用场景
          this.ruleForm.useScene = []
        } else if (newV === 'ARTIFICIAL') {
          //人工发放清空使用场景
          this.ruleForm.useScene = []
        } else if (newV === 'ACTIVITY') {
          //活动发放清空使用场景
          this.ruleForm.useScene = []
        } else if (newV === 'GOODS') {
          //商品发放清空使用场景
          this.ruleForm.useScene = []
        } else if (newV === 'PUBLIC' && this.ruleForm.useScene.length == 0) {
          // 公共发放
          this.ruleForm.useScene = ['YK_LIVE']
        }
      },
      deep: 'true'
    }
  },
  mounted() {
    this.$set(this.fileData, 'url', importUrl())
    this.$set(this.fileData, 'downUrl', downloadUrl())
    this.$set(this.fileIphonesData, 'url', importMobileUrl())
    this.$set(this.fileIphonesData, 'downUrl', downloadMobileUrl())
    //通过任务类型，判断展示组件
    this.getStatusList()
    if (this.dialogData.params.id) {
      //编辑
      this.isAdd = false
      this.getformDetail()
    } else {
      this.isAdd = true
    }
  },
  methods: {
    /* 获取筛选条件 */
    async getStatusList() {
      // 发放类型
      this.typeList = await sysNormalDisable('grant_types')
      this.ruleForm.grantType = this.typeList[0].dictValue
      // 优惠券类型
      this.couponTypeList = await sysNormalDisable('coupon_types')
      this.ruleForm.couponType = this.couponTypeList[0].dictValue
      // 发放场景
      this.sceneList = await sysNormalDisable('coupon_grant_scene')
      // 优惠券有效期
      this.timeList = await sysNormalDisable('coupon_validity_days')
      this.ruleForm.validity = this.timeList[0].dictValue
      // 优惠券适用范围
      this.rangeList = await sysNormalDisable('coupon_using_range')
      this.ruleForm.usingRange = this.rangeList[0].dictValue
      // 发放对象
      this.giveObjList = await sysNormalDisable('coupon_grant_object')
      this.ruleForm.issueObjectType = this.giveObjList[0].dictValue

      // 导入发放对象
      let artificialValue = await sysNormalDisable('artificial_add_type')
      //文件个导入 或 单发放对象
      this.giveImprotObjList = [...artificialValue]
      this.ruleForm.importObjectType = artificialValue[0].dictValue

      //指定场景还是全部
      this.singleAll = await sysNormalDisable('common_coupon_single_all')
      this.usageScenario = this.singleAll[0].dictValue

      //使用场景
      this.sinceList = await sysNormalDisable('common_coupon_scene_live')

      //全选使用场景
      let all = await sysNormalDisable('common_coupon_scene_all')
      this.sinceALL = this.sinceALL.concat(all[0].dictValue)

      // 学院
      let data = await sysNormalDisable('sys_college')
      this.collegeList = this.collegeList.concat(data)
    },
    /*系统发放-数据回填*/
    setSysObj(res) {
      let {
        achieve,
        collegeIds,
        courseNames,
        couponName,
        couponType,
        courseIds,
        fixedAmount,
        orderUpgrade,
        reduction,
        scene,
        usingRange,
        validity,
        discount
      } = res
      this.ruleForm = {
        grantType: this.dialogData.params.type,
        achieve,
        collegeIds,
        courseNames,
        couponName,
        couponType,
        courseIds,
        fixedAmount,
        orderUpgrade: orderUpgrade.toString(),
        reduction,
        scene,
        usingRange,
        validity: validity.toString(),
        discount,
        percentage: discount * 10
      }
      if (courseIds && courseIds.length > 0) {
        //根据id，获取商品列表
        getCollegeList(
          courseIds,
          (response) => {
            this.checkData = [...response]
          },
          (response) => {
            this.$message({
              message: response.message,
              type: 'warning'
            })
          }
        )
      }
    },
    /*人工发放-数据回填*/
    setArtificialObj(res) {
      let {
        achieve,
        collegeIds,
        couponName,
        couponType,
        courseIds,
        courseNames,
        endTime,
        startTime,
        fixedAmount,
        issueCollegeIds,
        issueObjectType,
        importObjectType,
        limitNumber,
        reduction,
        usingRange,
        usingRangeId,
        discount
      } = res
      this.ruleForm = {
        grantType: this.dialogData.params.type,
        achieve,
        collegeIds,
        courseNames,
        couponName,
        couponType,
        courseIds,
        time: [startTime, endTime],
        fixedAmount,
        issueCollegeIds,
        issueObjectType,
        importObjectType,
        limitNumber,
        reduction,
        usingRange,
        usingRangeId,
        dpAccounts: [],
        mobiles: [],
        percentage: discount * 10,
        giveMethod: issueObjectType === 'DEFAULT' ? 'import' : 'appoint'
      }
    },
    /*活动发放-数据回填*/
    setActiveObj(res) {
      let {
        achieve,
        collegeIds,
        courseNames,
        couponName,
        couponType,
        courseIds,
        fixedAmount,
        reduction,
        usingRange,
        discount,
        validity
      } = res
      this.ruleForm = {
        grantType: this.dialogData.params.type,
        achieve,
        collegeIds,
        courseNames,
        couponName,
        couponType,
        courseIds,
        fixedAmount,
        reduction,
        usingRange,
        discount,
        percentage: discount * 10,
        validity: validity.toString()
      }
      if (courseIds && courseIds.length > 0) {
        //根据id，获取商品列表
        getCollegeList(
          courseIds,
          (response) => {
            this.checkData = [...response]
          },
          (response) => {
            this.$message({
              message: response.message,
              type: 'warning'
            })
          }
        )
      }
    },
    /*公用发放-数据回填*/
    setPublicObj(res) {
      if (res.projectNames != null) {
        res.projectNameIds = res.projectNames.map((item) => {
          return { name: item }
        })
      } else {
        res.projectNameIds = []
      }

      //如果是全部就指定场景为全部选择
      if (res.useScene == 'ALL') {
        this.usageScenario = 'ALL'
      }
      let {
        achieve,
        collegeIds,
        courseNames,
        couponName,
        couponType,
        courseIds,
        projectNameIds,
        endTime,
        startTime,
        useScene,
        usageScenario,
        fixedAmount,
        issueCollegeIds,
        issueObjectType,
        limitNumber,
        reduction,
        usingRange,
        usingRangeId,
        discount
      } = res
      this.ruleForm = {
        grantType: this.dialogData.params.type,
        achieve,
        collegeIds,
        courseNames,
        couponName,
        couponType,
        courseIds,
        projectNameIds,
        publicTime: [startTime, endTime],
        useScene,
        usageScenario,
        fixedAmount,
        issueCollegeIds,
        issueObjectType,
        limitNumber,
        reduction,
        usingRange,
        usingRangeId,
        dpAccounts: [],
        percentage: discount * 10,
        giveMethod: issueObjectType === 'DEFAULT' ? 'import' : 'appoint'
      }
    },
    /*商品发放-数据回填*/
    setGoodsObj(res) {
      let {
        achieve,
        collegeIds,
        courseNames,
        couponName,
        couponType,
        courseIds,
        fixedAmount,
        reduction,
        usingRange,
        discount,
        validity
      } = res
      this.ruleForm = {
        grantType: this.dialogData.params.type,
        achieve,
        collegeIds,
        courseNames,
        couponName,
        couponType,
        courseIds,
        fixedAmount,
        reduction,
        usingRange,
        discount,
        percentage: discount * 10,
        validity: validity.toString()
      }
      if (courseIds && courseIds.length > 0) {
        //根据id，获取商品列表
        getCollegeList(
          courseIds,
          (response) => {
            this.checkData = [...response]
          },
          (response) => {
            this.$message({
              message: response.message,
              type: 'warning'
            })
          }
        )
      }
    },
    /*获取表单详情*/
    getformDetail() {
      let { id, type } = this.dialogData.params
      let obj = {
        type: type.toLowerCase()
      }
      getCouponsDetail(
        id,
        obj,
        (response) => {
          if (type === 'SYSTEM') {
            //系统发放
            this.setSysObj(response)
          } else if (type === 'ARTIFICIAL') {
            //人工发放
            this.setArtificialObj(response)
          } else if (type === 'ACTIVITY') {
            //活动发放
            this.setActiveObj(response)
          } else if (type === 'PUBLIC') {
            // 公用发放
            this.setPublicObj(response)
          } else if (type === 'GOODS') {
            //商品发放
            this.setGoodsObj(response)
          }
        },
        (response) => {}
      )
    },
    /*批量导入文件-成功*/
    getUsers(obj) {
      let ary = []
      obj.forEach((item) => {
        ary.push(item.dpNumber)
      })
      this.ruleForm.dpAccounts = [...ary]
    },
    /*批量导入手机号-成功 */
    getIphones(obj) {
      let ary = []
      obj.forEach((item) => {
        // 手机号后期改成手机号
        ary.push(item)
      })
      this.ruleForm.mobiles = [...ary]
    },
    /* 大鹏号导入失败弹窗 */
    showError(text) {
      this.errorDialogData.isShow = true // 显示导入失败弹框
      this.errorDialogData.warningText = text // 显示导入失败弹框
    },
    /*手机号导入失败弹窗 */
    mobileError(text) {
      this.errorDialogData.isShow = true // 显示导入失败弹框
      this.errorDialogData.warningText = text // 显示导入失败弹框
    },
    /*设置商品课程*/
    setChooseClass(aryId, aryObj, arrName) {
      this.ruleForm.courseIds = [...aryId]
      this.checkData = [...aryObj]
      // 将指定的商品课程map出来并赋值给courseNames数组
      this.ruleForm.courseNames = arrName.map((item) => {
        return item.courseName
      })
    },
    /*设置关联项目*/
    setAssociatedItems(arrName, arrName1) {
      this.ruleForm.projectNameIds = [...arrName]
      this.showCheckData = [...arrName1]
    },
    labelHandleClose(done) {
      this.cancelLabel()
      done()
    },
    cancelLabel() {
      // 关闭前清空
      this.loading = false
      this.dialogData.isShow = false
      this.dialogData.params = {}
    },
    /*指定商品课程-显示弹窗*/
    showClassDialog() {
      this.classDialogData.isShow = true
      this.classDialogData.courseIds = this.ruleForm.courseIds
        ? [...this.ruleForm.courseIds]
        : []
      this.classDialogData.checkData = this.checkData ? [...this.checkData] : []
    },
    /*指定关联项目--显示弹窗*/
    showAssociatedItems() {
      this.associatedItemsData.isShow = true
      this.associatedItemsData.projectNameIds = this.ruleForm.projectNameIds
        ? [...this.ruleForm.projectNameIds]
        : []
      this.associatedItemsData.showCheckData = this.showCheckData
    },
    /*指定场景*/
    handleUsageScenario() {
      // 如果是全选
      if (this.usageScenario == 'ALL') {
        this.ruleForm.useScene = []
        this.ruleForm.useScene = this.sinceALL
      } else {
        this.ruleForm.useScene = []
      }
    },
    /*营课直播和回放*/
    handleCheckedClassChange(value) {
      if (value.indexOf('YK_LIVE') > 0 || value.indexOf('YK_RECORD') > 0) {
        this.usageScenario === 'SINGLE'
      }
    },
    /*编辑时-获取提交参数*/
    getEditObj() {
      let obj = {}
      let { grantType } = this.ruleForm
      if (grantType === 'SYSTEM') {
        //系统发放
        let { collegeIds, courseIds, usingRange } = this.ruleForm
        obj = {
          grantType,
          system: {
            collegeIds: collegeIds || [],
            courseIds: courseIds || [],
            usingRange: usingRange || ''
          }
        }
      } else if (grantType === 'PUBLIC') {
        // 公用发放
        let {
          collegeIds,
          courseIds,
          usingRange,
          useScene
        } = this.ruleForm
        obj = {
          grantType,
          common: {
            collegeIds: collegeIds || [],
            courseIds: courseIds || [],
            usingRange: usingRange || '',
            useScene: useScene || []
          }
        }
      } else if (grantType === 'ACTIVITY') {
        //活动发放
        let { collegeIds, courseIds, usingRange } = this.ruleForm
        obj = {
          grantType,
          activity: {
            collegeIds: collegeIds || [],
            courseIds: courseIds || [],
            usingRange: usingRange || ''
          }
        }
      } else if (grantType === 'GOODS') {
        //商品发放
        let { collegeIds, courseIds, usingRange } = this.ruleForm
        obj = {
          grantType,
          goods: {
            collegeIds: collegeIds || [],
            courseIds: courseIds || [],
            usingRange: usingRange || ''
          }
        }
      } else {
        //人工发放
        let {
          dpAccounts,
          mobiles,
          usingRange,
          issueCollegeIds,
          issueObjectType,
          importObjectType
        } = this.ruleForm
        obj = {
          grantType,
          artificial: {
            dpAccounts: dpAccounts || [],
            mobiles: mobiles || [],
            usingRange: usingRange || '',
            issueCollegeIds: issueCollegeIds || [],
            issueObjectType: issueObjectType || '',
            importObjectType: importObjectType || ''
          }
        }
      }
      return obj
    },
    /*新增时-获取提交参数*/
    getAddObj() {
      let obj = {}
      let { grantType } = this.ruleForm
      if (grantType === 'SYSTEM') {
        //系统发放
        let {
          achieve,
          collegeIds,
          couponName,
          couponType,
          courseIds,
          discount,
          fixedAmount,
          orderUpgrade,
          reduction,
          scene,
          usingRange,
          validity
        } = this.ruleForm
        obj = {
          grantType,
          system: {
            achieve,
            collegeIds,
            couponName,
            couponType,
            courseIds,
            discount,
            fixedAmount,
            orderUpgrade,
            reduction,
            scene,
            usingRange,
            validity
          }
        }
      } else if (grantType === 'ARTIFICIAL') {
        //人工发放
        let {
          achieve,
          collegeIds,
          couponName,
          couponType,
          courseIds,
          discount,
          dpAccounts,
          mobiles,
          endTime,
          fixedAmount,
          issueCollegeIds,
          limitNumber,
          reduction,
          startTime,
          issueObjectType,
          importObjectType,
          usingRange
        } = this.ruleForm
        obj = {
          grantType,
          artificial: {
            achieve,
            collegeIds,
            couponName,
            couponType,
            courseIds,
            discount,
            dpAccounts,
            mobiles,
            endTime,
            fixedAmount,
            issueCollegeIds,
            issueObjectType,
            importObjectType,
            limitNumber,
            reduction,
            startTime,
            usingRange
          }
        }
      } else if (grantType === 'PUBLIC') {
        //公用发放
        let {
          achieve,
          collegeIds,
          couponName,
          couponType,
          courseIds,
          discount,
          endTime,
          projectNameIds,
          fixedAmount,
          reduction,
          startTime,
          usingRange,
          useScene
        } = this.ruleForm
        obj = {
          grantType,
          common: {
            achieve,
            collegeIds,
            couponName,
            couponType,
            courseIds,
            discount,
            endTime,
            projectNameIds,
            fixedAmount,
            reduction,
            startTime,
            usingRange,
            useScene
          }
        }
        obj.common.projectNameIds = obj.common.projectNameIds.map((item) => {
          return item.id
        })
      } else if (grantType === 'GOODS') {
        //商品发放
        let {
          validity,
          achieve,
          collegeIds,
          couponName,
          couponType,
          courseIds,
          discount,
          dpAccounts,
          endTime,
          fixedAmount,
          issueCollegeIds,
          limitNumber,
          reduction,
          startTime,
          issueObjectType,
          usingRange
        } = this.ruleForm
        obj = {
          grantType,
          goods: {
            validity,
            achieve,
            collegeIds,
            couponName,
            couponType,
            courseIds,
            discount,
            dpAccounts,
            endTime,
            fixedAmount,
            issueCollegeIds,
            issueObjectType,
            limitNumber,
            reduction,
            startTime,
            usingRange
          }
        }
      } else {
        //活动发放
        let {
          validity,
          achieve,
          collegeIds,
          couponName,
          couponType,
          courseIds,
          discount,
          dpAccounts,
          endTime,
          fixedAmount,
          issueCollegeIds,
          limitNumber,
          reduction,
          startTime,
          issueObjectType,
          usingRange
        } = this.ruleForm
        obj = {
          grantType,
          activity: {
            validity,
            achieve,
            collegeIds,
            couponName,
            couponType,
            courseIds,
            discount,
            dpAccounts,
            endTime,
            fixedAmount,
            issueCollegeIds,
            issueObjectType,
            limitNumber,
            reduction,
            startTime,
            usingRange
          }
        }
      }

      return obj
    },
    /* 确认提交 */
    async confirmLabel(formName) {
      let obj = {}
      let {
        grantType,
        issueObjectType,
        importObjectType,
        giveMethod
      } = this.ruleForm
      //发放类型-人工发放 && 发放方式-指定发放 && 发放对象-单个发放
      if (
        grantType === 'ARTIFICIAL' &&
        giveMethod === 'appoint' &&
        issueObjectType === 'DEFAULT' &&
        importObjectType === 'DAPENGHAO'
      ) {
        this.ruleForm.dpAccounts = [...this.dpNumberfileData.dpNum]
      } else if (
        grantType === 'ARTIFICIAL' &&
        giveMethod === 'appoint' &&
        issueObjectType === 'DEFAULT' &&
        importObjectType === 'IPHONE'
      ) {
        this.ruleForm.mobiles = [...this.ipNumberfileData.ipNum]
      }


      let _this = this
      if (!this.isSpan) {
        return new Promise((resolve, reject) => {
          _this.$refs.ruleForm.validate(async (valid) => {
            if (valid) {
              if (this.isAdd) {
                //新增
                let obj = this.getAddObj()
                addtCoupons(
                  obj,
                  (response) => {
                    this.sucCallBack()
                    this.loading = flase
                  },
                  (response) => {
                    this.errCallBack(response)
                    this.loading = flase
                  }
                )
              } else {
                //编辑
                let obj = this.getEditObj()
                this.loading = true
                eidtCoupons(
                  this.dialogData.params.id,
                  obj,
                  (response) => {
                    this.$message.success('操作成功！')
                    this.sucCallBack()
                  },
                  (response) => {
                    this.errCallBack(response)
                  }
                )
              }
            } else {
              return false
            }
          })
        })
      }
    },
    trim(x) {
      return x.replace(/\s+/g, '')
    },
    sucCallBack() {
      this.$emit('refresh')
      this.cancelLabel()
      this.loading = false
    },
    errCallBack(response) {
      this.loading = false
      this.$message({
        message: '编辑失败，' + response.message,
        type: 'warning'
      })
    }
  }
}
</script>
<style lang="less">
#dialogIntegralActionEdit {
  .margin0 {
    margin-bottom: 0 !important;
  }
  .form-title {
    font-weight: bold;
    font-size: 16px;
    padding-top: 5px;
  }
  .small {
    .el-input-number--mini {
      width: 70px;
      margin: 0 5px;
      .el-input__inner {
        padding-left: 5px;
        padding-right: 5px !important;
      }
    }
  }
  .el-form-item.line {
    display: inline-block;
    margin-bottom: 0;
  }
  .el-range-separator {
    box-sizing: content-box;
  }
  .el-range-editor--mini {
    height: 28px !important;
  }
  span.tips {
    color: #f00;
  }
  .full-input .el-input-number {
    width: 100%;
    .el-input__inner {
      text-align: left;
      font-size: 14px;
    }
  }
  #selectDpNumber .el-form-item {
    margin-bottom: 0;
  }
  .reduction {
    width: 170px;
  }
}
</style>
